/**
 *  准备工作 : :
 *   1. 安装 : vue-router
 *   2. 引入vue-router
 *   3. 把路由当成一个插件安装到Vue上
 *   4. 实例化路由对象 + 挂载vue实例上
 *   5. 导出路由
 *  在main.js里 导入 路由, 挂载vue实例 上
 *
 *  具体步骤 :
 *    1. 入口  url地址 调试 : /home  /login
 *    2. 路由规则
 *    3. 组件
 *        快捷方式 : sc
 *    4. 出口
 *
 */

// 0. 引入Vue
import Vue from 'vue'

// 1. 引入路由
import VueRouter from 'vue-router'
// 组件
import Home from '@/components/Home/Home.vue'
import Login from '@/components/Login/Login.vue'
import Users from './../components/Users/Users.vue'
import Roles from './../components/Roles/roles.vue'
import Rights from './../components/Rights/Rights.vue'

// 2. 模块化情况下,需要把路由当成插件安装
Vue.use(VueRouter)

// 3.实例路由对象
const router = new VueRouter({
  routes: [
    { path: '/', redirect: '/login' },
    { path: '/login', component: Login },
    {
      path: '/home',
      component: Home,
      children: [
        { path: '/users', component: Users },
        { path: '/roles', component: Roles },
        { path: '/rights', component: Rights }
      ]
    }
  ]
})

// 5. 导航守卫
// to : 目标对象 to.path
// from : 来源对象
// next : 继续下一步 (放你走) 必须要执行的
router.beforeEach((to, from, next) => {
  console.log(to.path)
  // 1. 判断访问的是不是登录页面
  if (to.path === '/login') {
    next()
  } else {
    console.log('不是登录页面哦')
    // 2. 判断是否登录过 (token)
    const token = localStorage.getItem('token')
    if (token) {
      next()
    } else {
      // 去 登录 页面
      next('/login')
    }
  }
})

// 4. 导出路由对象
export default router
